@import "_reset";

header{
    .header-box{
        // position: fixed;
        // top: 0;
        background-color: #fff;
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100vw;
        height: 14.6667vw;
        .back{
            width: 3.4667vw;
            height: 5.8667vw;
            margin-left: 2.9333vw;
        }
        .logo{
            width: 20.4373vw;
            height: 10.88vw;
        }
        .more{
            width: 4.5333vw;
            height: 4vw;
            margin-right: 9.3333vw;
        }
    }
}

.footer-box{
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 13.3333vw;
    background-color: #fff;
    display: flex;
    
    span{
        font-size: 3.2vw;
    }
    .box{
        width: 13.3333vw;
        height: 13.3333vw;
        background-color: #F6FAFB;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-end;
   
        .img-home{
            width: 5.6667vw;
            height: 6.6667vw;
        }
        .img-phone{
            width: 5.8667vw;
            height: 5.8667vw;
            margin-bottom: .2667vw;
        }
        .img-shop{
            width: 6.4vw;
            height: 5.3333vw;
            margin-bottom: 1.2667vw;
        }
        
    }
    .phone{
        border-right:2px solid #E9ECF0 ;
        border-left:2px solid #E9ECF0 ;
    }
    .botton{
        width: 29.8427vw;
        height: 13.3333vw;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .black{
        background-color: #3D4D42;
        color: #fff;
        span{
            font-size: 3.7333vw;
        }
    }
    .white{
      background-color: #FF734C;
      color: #fff;
      font-size: 3.7333vw;
    }

}

// 鲜花产品图
.flower-product{
    width: 100vw;
    height: 100vw;
    margin-bottom: 4vw;
}
// 产品介绍盒子
.content{
   
    span{
        color: #555555;
    }
    //  产品
.product-desc{
    overflow: hidden;
    border-bottom: 1px solid #E9ECF0;
    
    span{
        color: #555555;
    }
    .product-desc-text{
        display: block;
        width: 92vw;
        font-size: 4.2667vw;
        text-align: left;
        max-width: 92vw;
        margin: 0 auto;
    }      
    
}
// 产品价格以及销售数量
.product-money{
    display: flex;
    margin: 0 auto;
    justify-content: space-between;
    height: 11.4667vw;
    margin-bottom: 4.2667vw;
    max-width: 92vw;
    
    .product-price{
        display: flex;
        align-items: flex-end;
        position: relative;
        
        .new{
            font-size: 5.3333vw;
            color: #FF734C;
        }
        .old{
            
            font-size: 3.7333vw;
            color: #B4BABF;
        }
    }
    .self{
        display: flex;
        align-items: center;
        
       span{
        
        font-size: 3.2vw;
       }
    }
} 
// 产品配送信息
    .product-information{
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        margin-top: 1.3333vw ;
        max-width: 92vw;
        margin: 0 auto;
        span{
            font-size: 3.7333vw;
            // text-align: center;
        }
        
        .matierial{
            margin-top: 1.3333vw;
        }
        .box{
            height: 10.9333vw;
            display: flex;
            font-size: 3.7333vw;
            align-items: center;
            .text{
                width: 77.3333vw;
                height: 10.9333vw;
                display: flex;
                align-items: center;
                border-bottom: 1px solid #E9ECF0;
            }
            .div{
                width: 14.72vw;
               
                
            }
        }

    }
// 数量
.quantitu-box{
    background-color: #E9EDF2;
    display: flex;
    align-items: center;
    height: 20.5333vw;

    .quantitu{
        background-color: #fff;
        width: 100%;
        height: 16.5333vw;
        display: flex;
        align-items: center;
       .quantitu-desc{
        max-width: 92vw;
        width: 92vw;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
       
        .text{
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .botton-box{
            width: 72vw;
            height: 8.5333vw;
            display: flex;
            align-items: center;
            &::before{
                content: "-";
                display: inline-block;
                display: flex;
                align-items: center;
                justify-content: center;
                width: 8.2667vw;
                height: 8.2667vw;
                background-color:#F5F5F5;
                border: 1px solid  #DDDDDD;

            }
            &::after{
                content: "+";
                display: inline-block;
                display: flex;
                align-items: center;
                justify-content: center;
                width: 8.2667vw;
                height: 8.2667vw;
                background-color:#F5F5F5;
                border: 1px solid  #DDDDDD;

            }
            .number{
                width: 12.8vw;
                height: 8.5333vw;
                display: flex;
                align-items: center;
                justify-content: center;
                border: 1px solid  #DDDDDD;
            }
                }
       
        }
    }
}
// 订单评价
.order-evaluation{
// 顶部白条
    .order-top{
       
        border-bottom: 1px solid #E9ECF0; 
        .order{
            margin: 0 auto;
       
            display: flex;
            justify-content: space-between;
            align-items: center;
            max-width: 92vw;
            height: 14.1333vw;
            .desc{
                font-size: 4.2667vw;
            }
            .talk{
                font-size: 3.2vw;
            }
        }      
           
    }
    .usertalk{
        
        .user-number{
            max-width: 92vw;
            height: 10.6667vw;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            

            .morentou{
                width: 5.3333vw;
                height: 5.3333vw;
            }
            span{
                width: 72vw;
                font-size: 3.7333vw;
                
            }
            .star{
                width: 3.4667vw;
                height: 3.7333vw;
                
            }
        }
        .user-comment-box{
            .comment{
                max-width: 92vw;
                height: 39.7333vw;
                margin: 0 auto;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                width: 89.6vw;
                height: 35.7333vw;
                font-size: 3.7333vw;
                color: #555555;
                margin-bottom: 5.3333vw;
                .jpg{
                    width: 14.7173vw;
                    height: 19.6213vw;
                   
                    img{
                        width: 100%;
                        height: 100%;
                    }
                }
            } 
        }
        .user-comment{
            border-bottom: 1px solid #E9ECF0;
            
            
            .comment{
                max-width: 92vw;
                height: 39.7333vw;
                margin: 0 auto;
                margin-bottom: 6.9333vw;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                width: 89.6vw;
                height: 29.7333vw;
                font-size: 3.7333vw;
                
                    color: #555555;
                    .jpg{
                        width: 14.7173vw;
                        height: 19.6213vw;
                        
                        img{
                            width: 100%;
                            height: 100%;
                        }
                    }
                
            }
        }
        .buttom-tag{
            display: flex;
            align-items: center;
            width: 22.4vw;
            height: 7.7333vw;
            border: 1px solid #232628;
            margin: 0 auto;
            margin-bottom: 8vw;
            span{
                display: block;
                width: 22.4vw;
                text-align: center;
                font-size: 3.2vw;
                color: #232628;
                
            }
        }

    }


}



// 产品详情
.product-example{
        overflow: hidden;
    .example-top{
        
        max-width: 92vw;
        margin: 0 auto;
        margin-top: 3.7333vw;
        margin-bottom: 4.2667vw;
        span{
            
            font-size: 4.4vw;
        }
    }
    .img{
        width: 100vw;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .buttom-white{
        height: 30.6667vw;
    }
}



}


